<template>
  <div>
    <p class="data-a">HPRT HY58BT打印机操作流程</p>
    <p class="data-p">
      第一步：下载HPRT型号HY58BT驱动
      <a href="https://doubaobit.oss-cn-beijing.aliyuncs.com/HY58BT/HPRT_2018.2_M-1.exe">立即下载</a>
    </p>
    <ul>
      <li v-for="i in list" :key="i.value">
        <p class="data-k">{{i.item}}</p>
        <img :src="i.image" alt />
      </li>
    </ul>
    <ul>
      <li v-for="i in arr" :key="i.value">
        <p class="data-k">{{i.item}}</p>
        <img :src="i.image" alt />
      </li>
    </ul>
    <ul>
      <li class="data-li" v-for="i in arr1" :key="i.value">
        <p class="data-k">{{i.item}}</p>
        <img :src="i.image" alt />
      </li>
    </ul>
    <p class="data-p">第二步：打开电脑的打印机</p>
    <!-- <p class="data-k">1、选择HPRT HY58BT打印机，右击选择（打印首选项）</p> -->
    <ul>
      <li v-for="i in listi" :key="i.value">
        <p class="data-k">{{i.item}}</p>
        <img :src="i.image" alt />
      </li>
    </ul>
    <ul>
      <li v-for="i in lista" :key="i.value">
        <p class="data-k">{{i.item}}</p>
        <img :src="i.image" alt />
      </li>
    </ul>
    <p class="data-p">第三步：建议使用谷歌或者360浏览器，在网页上面右击，点击打印</p>
    <img src="https://hterobot-kimage.oss-cn-qingdao.aliyuncs.com/images/zhidao4.png" alt />
  </div>
</template>
<script>
export default {
  data() {
    return {
      list: [
        {
          item: "1：打开安装包，选择图片内容，点击下一步",
          image:
            "https://hterobot-kimage.oss-cn-qingdao.aliyuncs.com/images/zhidao.png"
        },
        {
          item: "2：点击下一步",
          image:
            "https://hterobot-kimage.oss-cn-qingdao.aliyuncs.com/images/zhidao1.png"
        },
        {
          item: "3：勾选所有内容，点击完成",
          image:
            "https://hterobot-kimage.oss-cn-qingdao.aliyuncs.com/images/zhidao2.png"
        }
        //  https://hterobot-kimage.oss-cn-qingdao.aliyuncs.com/images/zhidao2.png
      ],
      arr: [
        {
          item: "4：请先把打印机连接到电脑上",
          image:
            "https://hterobot-kimage.oss-cn-qingdao.aliyuncs.com/images/buzhou7.png"
        },
        {
          item: "5：选择HPRT HY58BT型号，点击下一步",
          image:
            "https://hterobot-kimage.oss-cn-qingdao.aliyuncs.com/images1/erweimaok.png"
        },
        {
          item: "6：选择端口USB001",
          image:
            "https://hterobot-kimage.oss-cn-qingdao.aliyuncs.com/images1/erweimaij.png"
        }
        // {
        //   item: 7,
        //   image:
        //     "https://hterobot-kimage.oss-cn-qingdao.aliyuncs.com/images1/erweimauh.png"
        // },
      ],
      arr1: [
        {
          item: "7：给打印机一个名称，方便区别于其他打印机。",
          image:
            "https://hterobot-kimage.oss-cn-qingdao.aliyuncs.com/images1/erweimauh.png"
        }
      ],
      listi: [
        {
          item: "1：打开电脑的控制面板",
          image:
            "https://hterobot-kimage.oss-cn-qingdao.aliyuncs.com/images/buzhou1.png"
        },
        {
          item: "2：选择查看设备和打印机",
          image:
            "https://hterobot-kimage.oss-cn-qingdao.aliyuncs.com/images/buzhou2.png"
        },
        {
          item: "3：选择你需要的打印机右击选择（打印首选项）",
          image:
            "https://hterobot-kimage.oss-cn-qingdao.aliyuncs.com/images/buzhou3.png"
        }
      ],
      lista: [
        {
          item: "4：点击新建。",
          image:
            "http://hterobot-kimage.oss-cn-qingdao.aliyuncs.com/images/buzhou4.png"
        },
        {
          item: "5：更改标签大小，如图所示。",
          image:
            "https://hterobot-kimage.oss-cn-qingdao.aliyuncs.com/images/buzhou5.png"
        },
        {
          item: "6：点击图形，选择误差扩散法。点击应用接着点击完成",
          image:
            "https://hterobot-kimage.oss-cn-qingdao.aliyuncs.com/images/buzhou6.png"
        }
      ]
    };
  }
};
</script>
<style scoped>
ul {
  display: flex;
}
li {
  list-style: none;
  float: left;
  flex: 1;
}
li img {
  width: 80%;
}
.data-p {
  font-size: 20px;
  font-family: cursive;
  font-weight: 600;
  color: #333;
}
.data-a {
  text-align: center;
  font-size: 30px;
  font-family: cursive;
  font-weight: 600;
  color: #333;
}
.data-k {
  font-size: 17px;
  font-family: cursive;
  color: #333;
}
.data-li img {
  width: 27%;
}
</style>